<template>
  <basic-container>
    <div class="school">
      <el-row class="schoolTitleCss" style="padding-top: 4%"
        ><span>{{ schoolName }}</span></el-row
      >
      <!-- <el-row
        style="
          margin-top: 2%;
          font-size: 20px;
          margin-left: 31px;
          font-weight: bold;
        "
      >
        <el-col :span="11">整体概况</el-col>
        <el-col :span="13">
          <span class="m-left20">年度</span>
          <el-select
            v-model="yearly"
            size="small"
            style="width: 200px"
            clearable
            class="m-left20"
          >
            <el-option
              v-for="item in yearlyList"
              :key="item.yearly"
              :label="item.yearly"
              :value="item.yearly"
            >
            </el-option>
          </el-select>
          <span class="m-left20">学期</span>
          <el-select
            class="m-left20"
            v-model="term"
            size="small"
            style="width: 200px"
            clearable
          >
            <el-option
              v-for="item in semesterList"
              :key="item.termId"
              :label="item.term"
              :value="item.termId"
            >
            </el-option>
          </el-select>
          <span>
            <el-button
              type="primary"
              size="small"
              @click="searchProjectData"
              style="margin-left: 10px; position: absolute"
            >
              搜索
            </el-button>
          </span>
        </el-col>
      </el-row> -->
      <el-row
        class="borderCss"
        style="padding: 20px; margin-left: 10px; margin-right: 10px"
        v-if="isLoad"
      >
        <el-row>
          <el-col
            :span="4"
            class="texAlignCenter"
            style="border-right: 2px solid"
          >
            <el-row>
              <span class="topTitleCss">学校总数</span>
            </el-row>
            <el-row
              ><span style="color: #3eea3e">{{ schoolNum.length }}</span>
            </el-row>
          </el-col>
          <!-- <el-col
            :span="3"
            class="texAlignCenter"
            style="border-right: 2px solid"
          >
            <el-row>
              <span class="topTitleCss">学生总数</span>
            </el-row>
            <el-row
              ><span style="color: #3eea3e">{{
                educationDataObj.totalTenantPostNumber.studentNum || 0
              }}</span>
              人</el-row
            >
          </el-col> -->
          <el-col
            :span="5"
            class="texAlignCenter"
            style="border-right: 2px solid"
          >
            <el-row>
              <span class="topTitleCss">发布测评人数</span>
            </el-row>
            <el-row
              ><span style="color: #3eea3e">{{
                educationDataObj.findReleaseFinishTestNum.length
                  ? educationDataObj.findReleaseFinishTestNum[0].num
                  : 0
              }}</span>
              人</el-row
            >
          </el-col>
          <el-col
            :span="5"
            class="texAlignCenter"
            style="border-right: 2px solid"
          >
            <el-row><span class="topTitleCss">已完成测评人数</span></el-row>
            <el-row>
              <span style="color: #3eea3e">{{
                educationDataObj.findFinishTestNum.length
                  ? educationDataObj.findFinishTestNum[0].num
                  : 0
              }}</span>
              人
            </el-row>
          </el-col>
          <el-col
            :span="5"
            class="texAlignCenter"
            style="border-right: 2px solid"
          >
            <el-row><span class="topTitleCss">未完成测评人数</span></el-row>
            <el-row>
              <span style="color: #3eea3e">{{
                educationDataObj.findNoReleaseFinishTestNum.length
                  ? educationDataObj.findNoReleaseFinishTestNum[0].num
                  : 0
              }}</span>
              人
            </el-row>
          </el-col>
          <!-- <el-col
            :span="4"
            class="texAlignCenter"
            style="border-right: 2px solid"
          >
            <el-row><span class="topTitleCss">未完成测评人数</span></el-row>
            <el-row
              ><span style="color: #ffbb00">{{
                educationDataObj.findFinishNoTestNum.length
                  ? educationDataObj.findFinishNoTestNum[0].num
                  : 0
              }}</span>
              人</el-row
            >
          </el-col> -->
          <el-col :span="5" class="texAlignCenter">
            <el-row><span class="topTitleCss">预警人数</span></el-row>
            <el-row
              ><span style="color: red">{{
                educationDataObj.findLevelAllNum[0].num
              }}</span>
              人</el-row
            >
          </el-col>
        </el-row>
      </el-row>
      <el-row v-if="isLoad" style="margin: 5px">
        <el-row>
          <el-col :span="8">
            <letBoard :educationDataObj="educationDataObj"></letBoard>
          </el-col>
          <el-col :span="16">
            <rightBorad
              :educationDataObj="educationDataObj"
            ></rightBorad> </el-col
        ></el-row>
      </el-row>
    </div>
  </basic-container>
</template>

<script>
import { mapGetters } from "vuex";
import {
  findALLNumEducation,
  findReleaseFinishTestNumEducation,
  findAllGradeLevelInterveneNumEducation,
  findFinishNoTestNumEducation,
  findFinishTestNumEducation,
  findGradeLevelInterveneNumEducation,
  findNoReleaseFinishTestNumEducation,
  findLevelAllNumEducation,
  findLevelAreaNumEducation,
  findLevelNumEducation,
  findLevelSexNumEducation,
  findSexLevelNumEducation,
  findAllGradeNoTestNumEducation,
  findGradeLevelNum1Education,
  totalTenantPostNumber,
} from "@/api/report/report";
import { getList } from "@/api/system/dict";
import { getTermListAll } from "@/api/system/semester";
import { getNewUserInfo } from "@/api/user";
import letBoard from "./letBoard";
import rightBorad from "./rightBorad";
import { uniqBy } from "lodash-es";
export default {
  name: "thirdRegister",
  components: { letBoard, rightBorad },
  data() {
    return {
      isLoad: false,
      schoolName: "",
      tenantId: "",
      projectId: "",
      time: "",
      educationDataObj: {},
      yearlyList: [],
      semesterList: [],
      yearly: "",
      half: "",
      term: "",
      schoolNum: [],
    };
  },
  computed: {
    ...mapGetters(["userInfo"]),
  },
  created() {},
  mounted() {
    getTermListAll(1, 1000, {}).then((result) => {
      var _this = this; //注意！一定要重新定义一下this指向
      let res18DataList = result.data.data;
      for (let zz = 0; zz < res18DataList.length; zz++) {
        let item = res18DataList[zz];
        _this.yearlyList.push(item);
        _this.semesterList.push(item);
        if (item.currentFlag == "Y") {
          _this.term = item.termId;
          _this.yearly = item.yearly;
        }
      }
      _this.yearlyList = uniqBy(_this.yearlyList, "yearly");
      _this.semesterList = uniqBy(_this.semesterList, "termId");
      this.initData();
    });
  },
  methods: {
    searchProjectData() {
      this.isLoad = false;
      this.initData();
    },
    initData() {
      let tenantId = JSON.parse(window.localStorage.getItem("saber-userInfo"))
        .content.tenantId;
      var _this = this;
      this.$axios
        .all([
          findALLNumEducation({
            tenantId: tenantId,
            termId: _this.term,
            yearly: _this.yearly,
          }),
          findReleaseFinishTestNumEducation({
            tenantId: tenantId,
            termId: _this.term,
            yearly: _this.yearly,
          }),
          findAllGradeLevelInterveneNumEducation({
            tenantId: tenantId,
            termId: _this.term,
            yearly: _this.yearly,
          }),
          findFinishNoTestNumEducation({
            tenantId: tenantId,
            termId: _this.term,
            yearly: _this.yearly,
          }),
          findFinishTestNumEducation({
            tenantId: tenantId,
            termId: _this.term,
            yearly: _this.yearly,
          }),
          findGradeLevelInterveneNumEducation({
            tenantId: tenantId,
            termId: _this.term,
            yearly: _this.yearly,
          }),
          findNoReleaseFinishTestNumEducation({
            tenantId: tenantId,
            termId: _this.term,
            yearly: _this.yearly,
          }),
          findLevelAllNumEducation({
            tenantId: tenantId,
            termId: _this.term,
            yearly: _this.yearly,
          }),
          findLevelAreaNumEducation({
            tenantId: tenantId,
            termId: _this.term,
            yearly: _this.yearly,
          }),
          findLevelNumEducation({
            tenantId: tenantId,
            termId: _this.term,
            yearly: _this.yearly,
          }),
          findLevelSexNumEducation({
            tenantId: tenantId,
            termId: _this.term,
            yearly: _this.yearly,
          }),
          findSexLevelNumEducation({
            tenantId: tenantId,
            termId: _this.term,
            yearly: _this.yearly,
          }),
          findAllGradeNoTestNumEducation({
            tenantId: tenantId,
            termId: _this.term,
            yearly: _this.yearly,
          }),
          findGradeLevelNum1Education({
            tenantId: tenantId,
            termId: _this.term,
            yearly: _this.yearly,
          }),
          getNewUserInfo({}),
          totalTenantPostNumber({
            tenantId: tenantId,
            category: 2,
            gradeId: "",
          }),
          totalTenantPostNumber({
            // tenantId: tenantId,
            category: 4,
            gradeId: "",
          }),
          getList(1, 1000, { code: "warning_level" }),
        ])
        .then(
          _this.$axios.spread(function (
            res1,
            res2,
            res3,
            res4,
            res5,
            res6,
            res7,
            res8,
            res9,
            res10,
            res11,
            res12,
            res13,
            res14,
            res15,
            res16,
            res17,
            res18
          ) {
            _this.educationDataObj.findALLNum = res1.data.data;
            _this.educationDataObj.findReleaseFinishTestNum = res2.data.data;
            _this.educationDataObj.findAllGradeLevelInterveneNum =
              res3.data.data;
            _this.educationDataObj.findFinishNoTestNum = res4.data.data;
            _this.educationDataObj.findFinishTestNum = res5.data.data;
            _this.educationDataObj.findGradeLevelInterveneNum = res6.data.data;
            _this.educationDataObj.findNoReleaseFinishTestNum = res7.data.data;
            _this.educationDataObj.findLevelAllNum = res8.data.data;
            _this.educationDataObj.findLevelAreaNum = res9.data.data;
            _this.educationDataObj.findLevelNum = res10.data.data;
            _this.educationDataObj.findLevelSexNum = res11.data.data;
            _this.educationDataObj.findSexLevelNum = res12.data.data;
            _this.educationDataObj.findAllGradeNoTestNum = res13.data.data;
            _this.educationDataObj.findGradeLevelNum1 = res14.data.data;
            _this.schoolName = res15.data.data.tenantName;
            _this.educationDataObj.totalTenantPostNumber = {};
            _this.educationDataObj.totalTenantPostNumber.teacherNum =
              res16.data.data;
            _this.educationDataObj.totalTenantPostNumber.studentNum =
              res17.data.data;
            let levelData = [];
            res18.data.data[0].children.map((vv) => {
              if (vv.dictKey != 0) {
                levelData.push(vv);
              }
            });
            _this.educationDataObj.findAllGradeLevelInterveneNum.map((item) => {
              if (_this.schoolNum.indexOf(item.schoolName) == -1) {
                _this.schoolNum.push(item.schoolName);
              }
            });
            _this.educationDataObj.levelData = levelData;
            // console.log(_this.educationDataObj);
            _this.isLoad = true;
          })
        );
    },
  },
};
</script>
<style lang="scss">
.school {
  background: url("schoolBorad.png") no-repeat;
  width: 100%;
  height: 100%;
  color: #0986b3;
  background-color: #091238;
  background-size: 100%;
}
.m-left20 {
  margin-left: 20px;
}
.texAlignLeft {
  text-align: left;
}
.texAlignCenter {
  text-align: center;
}
.texAlignRight {
  text-align: right;
}
.tableTdCss {
  border: 1px solid white;
}
.headerCss {
  background: #29d;
  color: white;
}
.tableRowSingle {
  background: #ebeef5;
}
.tableRowDouble {
  background: #ecf5ff;
}
.schoolTitleCss {
  color: white;
  font-size: 20px;
  text-align: center;
  margin-top: -34px;
}
.borderCss {
  margin: 5px;
  border: 2px solid;
}
.marginInfo {
  margin-left: 10px;
  margin-top: 10px;
}
.topTitleCss {
  border: 1px solid #0984b1;
  padding: 3px 13px 3px 13px;
  color: white;
  font-size: 17px;
  background: #0985b2;
  margin-bottom: 5px;
  display: inline-block;
  border-radius: 5px;
}
</style>
